<template>
  <div class="w-100">
    <AplidForm
					v-bind="formConfig"
					v-model="widgetFormConfig"
				></AplidForm>
  </div>
</template>

<script setup lang="ts">
import { useDesign } from '@/stores/design'

const {setWidgetFormConfig} = useDesign()
const { widgetFormConfig} = storeToRefs(useDesign())

const formConfig = {
	inline: false,
	labelPosition: 'top',
	labelWidth: '240px',
	showBtn: true,
	column: [
		{
			type: 'DividerHtml',
			modelValue: '设置间距',
			span: 24,
      labelPosition:'top'
		},
		{
			label: '水平间距',
			prop: 'vmargin',
			type: 'text',
			span: 12,
		},
		{
			label: '垂直间距',
			prop: 'hmargin',
			type: 'text',
			span: 12,
		},
	],
}

onMounted(()=> {
  setWidgetFormConfig({
    vmargin:10,
    hmargin:10,
  })
})
</script>

<style scoped>

</style>